// 1. 引入
import router from '@/router'
import store from '@/store'

// 引入进度条插件
import NProgress from 'nprogress' // 引入进度条对象
// 如果要重写进度条样式, 可以复制一份独立修改, 尽量不要在源文件上修改
import '@/styles/hr-nprogress.scss' // 引入进度条样式

const whiteList = ['/login', '/404']

// 2. 配置路由全局前置守卫
router.beforeEach(async(to, from, next) => {
  // 2.0 开启进度条效果
  NProgress.start()

  // 2.1 判断是否有token
  if (store.getters.token) { // 有身份
    if (to.path === '/login') { // 有身份 & 去登录页
      next('/') // 拦截去主页面
      NProgress.done() // 第一处
    } else { // 有身份 & 去其它页面
      // 获取用户的信息(异步的) --> 只有仓库中没有用户信息时才去获取
      if (!store.state.user.userInfo.userId) {
        const res = await store.dispatch('user/getUserInfo')
        // console.log(res)

        // 1. 派发actions, 获取动态路由数组对象
        const otherRoutes = await store.dispatch('permission/filterRoutes', res.roles.menus)

        // 2. 动态添加路由对象(要做权限管理)
        // { path: '*', redirect: '/404', hidden: true }
        /*
          此处添加404的路由对象, 保证了两点:
          1) 通配符路由对象一定是在所有的路由对象(静态和动态)都有了之后才添加
          2) 在路由对象数组的尾部
        */
        router.addRoutes([
          ...otherRoutes,
          { path: '*', redirect: '/404', hidden: true }
        ])

        // 3. 重新访问一次
        next({
          ...to,
          replace: true // 解决重复跳转问题
        })
        return
      }

      next() // 直接放行
    }
  } else { // 没身份
    if (whiteList.indexOf(to.path) >= 0) { // 去白名单中路径对应的页面
      next()
    } else { // 去白名单中路径对应以外的页面
      next('/login')
      NProgress.done() // 第二处
    }
  }
})

// 3. 配置路由全局后置守卫
// 页面已经展示出来, 然后触发
// 注意注意: 有一种情况它不会进全局的路由后置守卫: 当访问的路径被拦截去其它路径时
// 此时就应该特殊处理: 在所有拦截的地方, 手动结束
router.afterEach((to, from) => {
  // console.log('----来了后置守卫------')
  // 为了体验效果
  // setTimeout(() => {
  // 3.1 结束进度条效果
  NProgress.done()
  // }, 500)
})
